import React from 'react';
import { useHistory } from 'react-router';
import { MyListWrapper } from './styleMy';
import Icon from "@/components/icon/Icon"
import List from '@/components/myComponents/list/List';

const MyList = () => {
    const history=useHistory()
    const clickHandler=(type)=>{
        return ()=>{
            switch(type){
                case "records":
                    history.push("/My/record")
                    break;
                case "member":
                    history.push("/My/member")
                    break;
                case "healthText":
                    history.push("/My/healthText")
                    break;
                case "monitoring":
                    history.push("/My/monitoring")
                    break;
                case "doctorsTeam":
                    history.push("/My/doctorsTeam")
                    break;
                case "serve":
                    history.push("/My/serve")
                    break;
                case "collection":
                    history.push("/My/collection")
                    break;
                default:
                    // throw new Error("未知错误!!")
                    history.push("/404")
            }
        }
    }

    return (
        <MyListWrapper>
            <List onClick={clickHandler("records")}>
                <Icon
                    name="newspaperFill"
                    padding=".08rem"
                    bgColor="#eaf3fe"
                    color="#2984f8"
                    type="large"
                    size=".2rem"
                ></Icon>
                <div>签约记录</div>
            </List>
            <List onClick={clickHandler("member")}>
                <Icon
                    name="userVoiceFill"
                    padding=".08rem"
                    bgColor="#fff1f0"
                    color="#fa746b"
                    type="large"
                    size=".2rem"
                ></Icon>
                <div>家庭成员管理</div>
            </List>
            <List onClick={clickHandler("healthText")}>
                <Icon
                    name="editLine"
                    padding=".08rem"
                    bgColor="#fff8e4"
                    color="#fdd878"
                    type="large"
                    size=".2rem"
                ></Icon>
                <div>我的健康档案</div>
            </List>
            <List onClick={clickHandler("monitoring")}>
                <Icon
                    name="barChartFill"
                    padding=".08rem"
                    bgColor="#f1f2fe"
                    color="#6c76f4"
                    type="large"
                    size=".2rem"
                ></Icon>
                <div>我的健康监测</div>
            </List>
            <List onClick={clickHandler("doctorsTeam")}>
                <Icon
                    name="groupFill"
                    padding=".08rem"
                    bgColor="#eafaf5"
                    color="#3dd4a7"
                    type="large"
                    size=".2rem"
                ></Icon>
                <div>我的医生团队</div>
            </List>
            <List onClick={clickHandler("serve")}>
                <Icon
                    name="wallet3Fill"
                    padding=".08rem"
                    bgColor="#eaf3fe"
                    color="#2984f8"
                    type="large"
                    size=".2rem"
                ></Icon>
                <div>我的服务包</div>
            </List>
            <List onClick={clickHandler("collection")}>
                <Icon
                    name="heart2Fill"
                    padding=".08rem"
                    bgColor="#eaf3fe"
                    color="#2984f8"
                    type="large"
                    size=".2rem"
                ></Icon>
                <div>我的收藏</div>
            </List>
        </MyListWrapper>
    );
}

export default MyList;